<template >
  <u-row
    :style="[compStyle]"
    :gutter="option.gutter"
    :justify="option.justify"
    :align="option.align"
    @click="option.click"
    >
	<template v-for="(item,index) in option.childOptions">
		<r-col v-if="item.type=='r-col'" :option="item.option"></r-col>
		<!-- <r-vue-page-itemcell v-else :options="item.childOptions"></r-vue-page-itemcell> -->
	</template>
	</u-row >
</template>

<script>
	/**
	 * Row 栅格系统中的行
	 * @description 通过基础的 12 分栏，迅速简便地创建布局 
	 * @tutorial https://www.uviewui.com/components/layout.html
	 * @property {String | Number}	gutter		栅格间隔，左右各为此值的一半，单位px  (默认 0 )
	 * @property {String}			justify		水平排列方式(微信小程序暂不支持) 可选值为`start`(或`flex-start`)、`end`(或`flex-end`)、`center`、`around`(或`space-around`)、`between`(或`space-between`)  (默认 'start' )
	 * @property {String}			align		垂直排列方式 (默认 'center' )
	 * @property {Object}			customStyle	定义需要用到的外部样式
	 * 
	 * @event {Function} click row被点击
	 * @example <u-row justify="space-between" customStyle="margin-bottom: 10px"></u-row>
	 */
export default {
  name: "r-rows",
  props: {
    option: {
      type: Object,
      require: true,
    },
    compStyle: {
      type: Object,
      require: true,
    },
  },
};
</script>

<style lang="scss">
</style>